import { reactive } from "vue"
import { topPopoverContentThemeDefault,topPopoverContentThemeDark } from '@/configs/themeConfig'

interface themeData{  //变量类型
    backGround:string,
    titleColor:string,
    lableColor:string,
    hoverLableBackgroundColor:string,
    vipBlackground:string,
    selCollectLeftNum:string
    searchItemBack:string
    footerBackGround:string
    topBackBotLineColor:string
}
export interface resType{  //函数返回值类型
    '--backgroundColor':string,
    '--titleColor':string,
    '--lableColor':string,
    '--hoverLableColor':string,
    '--vipBlackground':string,
    '--selCollectLeftNum':string
    '--searchItemBack':string
    '--footerBackGround':string
    '--topBackBotLineColor':string
}
let theme = reactive<themeData>({  //定义类型变量对象
    backGround:'',
    titleColor:'',
    lableColor:'',
    hoverLableBackgroundColor:'',
    vipBlackground:'',
    selCollectLeftNum:'',
    searchItemBack:'',
    footerBackGround:'',
    topBackBotLineColor:''
})

//通过路由获得当前组件的配色 并返回
export function getThemes( name:string ) :resType {
    theme = byRouterGetTheme( name )
    return {
        '--backgroundColor':theme.backGround,
        '--titleColor':theme.titleColor,
        '--lableColor':theme.lableColor,
        '--hoverLableColor':theme.hoverLableBackgroundColor,
        '--vipBlackground':theme.vipBlackground,
        '--selCollectLeftNum':theme.selCollectLeftNum,
        '--searchItemBack':theme.searchItemBack,
        '--footerBackGround':theme.footerBackGround,
        '--topBackBotLineColor':theme.topBackBotLineColor
    }
}

function byRouterGetTheme( name:string ):themeData {
    if (name === 'dynamicTV') {
        return topPopoverContentThemeDark
    } else{
        return topPopoverContentThemeDefault
    }
    
} 